<template>
  <el-dialog title="修正库位"
             :visible.sync="dialogForm"
             width="1200px">
    <el-form :inline="true"
             ref="form"
             :model="form"
             :rules="rules"
             class="add-form"
             label-width="110px">
      <el-row class="row">
        <el-col :span="8"
                class="el-height"><span class="labels">跟踪号:</span>{{form.trackingNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">品名:</span>{{form.cargoName}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">规格:</span>{{form.normStr}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">材质:</span>{{form.material}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">生产厂家:</span>{{form.madeBy}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">件数:</span>{{form.inventoryNum}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">重量:</span>{{form.inventoryWeight}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">数量:</span>{{form.inventoryCount}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">仓库:</span>{{form.warehouseName}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">库房:</span>{{form.roomName}}</el-col>
      </el-row>
      <h3>原库位</h3>
      <hr />
      <el-row class="row">
        <el-col :span="8"
                class="el-height"><span class="labels">跨数:</span>{{form.spanNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">间数:</span>{{form.aulaNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">排数:</span>{{form.rowNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">垛数:</span>{{form.stackNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">层数:</span>{{form.tierNo}}</el-col>
      </el-row>
      <h3>新库位</h3>
      <hr />
      <el-row class="newRow">
        <el-col :span="8">
          <el-form-item label="跨数"
                        prop="newSpan">
            <el-input type="text"
                      v-model.trim="form.newSpan"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="间数"
                        prop="newAula">
            <el-input type="text"
                      v-model.trim="form.newAula"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="排数"
                        prop="newRowNo">
            <el-input type="text"
                      v-model.trim="form.newRowNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="垛数"
                        prop="newStackNo">
            <el-input type="text"
                      v-model.trim="form.newStackNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="层数"
                        prop="newTierNo">
            <el-input type="text"
                      v-model.trim="form.newTierNo"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button @click="handleSave"
                 type="primary">保存</el-button>
      <el-button @click="handleSubmit"
                 type="primary">提交</el-button>
      <el-button @click="dialogForm = false">返 回</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { modRoomLocation } from '@/api/matter/cheackPlan'
import { PUBLIC_INT_NULL_ZERO } from '@/utils/Reg'
import { twoLength } from '@/utils/rules'

export default {
  name: 'modStorehouseForm',
  data() {
    return {
      form: this.clearForm(),
      rules: {
        newSpan: [
          { validator: PUBLIC_INT_NULL_ZERO, trigger: 'blur' },
          twoLength
        ],
        newAula: [
          { required: true, validator: PUBLIC_INT_NULL_ZERO, trigger: 'blur' },
          twoLength
        ],
        newRowNo: [
          { validator: PUBLIC_INT_NULL_ZERO, trigger: 'blur' },
          twoLength
        ],
        newStackNo: [
          { validator: PUBLIC_INT_NULL_ZERO, trigger: 'blur' },
          twoLength
        ],
        newTierNo: [
          { validator: PUBLIC_INT_NULL_ZERO, trigger: 'blur' },
          twoLength
        ]
      },
      dialogForm: false,
      radio: 1,
      data: []
    }
  },
  // computed: {
  //   addZero: function() {
  //     console.log(1, this.form.newAula)
  //     console.log(2, this.form.newAula.length)
  //     let length = this.form.newAula.length
  //     if (length < 2) {
  //       this.form.newAula = '0' + this.form.newAula
  //     }
  //     console.log(3, this.form.newAula)
  //   }
  // },
  methods: {
    clearForm() {
      return {
        newSpan: '',
        newAula: '',
        newRowNo: '',
        newStackNo: '',
        newTierNo: ''
      }
    },
    //保存
    handleSave() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.form.submitType = 2
          modRoomLocation(this.form.inventoryId, this.form).then(res => {
            this.$message({ message: '修改成功!', type: 'success' })
            this.dialogForm = false
            this.$emit('load')
          })
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    },
    //提交
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.form.submitType = 1
          modRoomLocation(this.form.inventoryId, this.form).then(res => {
            this.$message({ message: '提交成功!', type: 'success' })
            this.dialogForm = false
            this.$emit('load')
          })
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.el-height {
  margin: 10px 0;
}
h3 {
  margin: 10px 0;
}
.labels {
  margin-right: 5px;
}
.adjustNumber {
  margin: 20px 0;
  margin-left: 40px;
}
.row {
  margin-left: 80px;
}
.newRow {
  margin-top: 20px;
}
</style>
